/**
* Copyright (c) 2018-present, Chen Guodong
* All rights reserved.
*
* @flow
*/
<template>
  <section class="content">
    <Header :title="data.title">
      <div class="left" slot="left" @click="goBack">
        <i class="iconfont icon-previewleft" style="font-size: 22px"></i>
      </div>
    </Header>
    <div class="main">
      <div class="main-content">
        <!-- <CollapseItem v-for="(item,index) in data" :key="index" :tableData="tableData" :index="index" :data="item"></CollapseItem> -->
        <table>
          <thead>
            <tr>
              <th v-for="(item,index) in tableData.header">{{item}}</th>
            </tr>
          </thead>
          <tbody>
            <tr v-for="(item, index) in data.item" :key="index">
              <td v-for="(j,k) in tableData.columns" :key="k">{{item[j]}}</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </section>
</template>
<script>
import Header from '../../components/Header/Header.vue';
import CollapseItem from '../../components/CollapseItem/CollapseItem.vue';
import { reqGetMongyList } from '../../api/index.js';
export default {
  data() {
    return {
      data: [],
      tableData: {
        header: ['编号', '金额(万元)', '经办人', '日期', '明细'],
        columns: ['logid', 'amount', 'createuser', 'createtime', 'detail'],
        unit: '万元'
      }
    };
  },
  mounted() {
    this.initData();
  },
  methods: {
    goBack() {
      if (window.history.length <= 1) {
        this.$router.push({ path: '/' })
        return false
      } else {
        this.$router.go(-1)
      }
    },
    async initData() {
      this.$store.dispatch('changeLoadingVis', { data: true })
      const result = await reqGetMongyList({ timetype: this.$router.history.current.query.type,  seqno: this.$router.history.current.query.seqno })
      if (result.code === 1) {
        this.data = result.data[0];
      } else {
        this.$vux.toast.show({
          type: 'text',
          text: result.msg || '获取数据失败'
        });
      }
      this.$store.dispatch('changeLoadingVis', { data: false })
    }
  },
  components: {
    Header,
    CollapseItem
  }
};

</script>
<style lang='less' scoped>
@import "../../util/theme.less";

.content {
  .be-full();

  .main {
    height: calc(~"100% - 46px");

    .main-content {
      width: 100%;
      height: 100%;
      overflow: auto;
      background: @white;
    }
  }
}

table {
  width: 100%;
  padding: 0 6px;
}

tr {}

td,
th {
  padding: 6px 0;
  font-size: 12px;
  text-align: center;
  border-bottom: 1px dashed @border-base;
}

</style>
